import React, { Component } from 'react'
import Todoitem from './Todoitem'
import PropTypes from 'prop-types'



export default class Todolist extends Component {
    
    static propTypes={
        todos: PropTypes.arrayOf(PropTypes.shape({
            id: PropTypes.number.isRequired,
            title:PropTypes.string.isRequired,
            completed:PropTypes.bool.isRequired
        }))
    }
    


    render() {
        
        return (
            <ul>
                {
                    this.props.todos.map( todo =>{
                        return(
                            <Todoitem 
                                key = {todo.id}
                                {...todo}
                                deleteTodo={this.props.deleteTodo}
                            />  
                        )
                    })  
                }
            </ul>
        )
    }
}
